<template>
    <el-container style="height: 100%;">
        <el-header>
            <el-row :gutter="20" style="color:#000">
                <el-col :span="12">
                    <div style="font-size: 20px; font-weight: 900;line-height: 60px">
                        美易通--2018
                    </div>
                </el-col>
                <el-col :span="12">
                    <div style="float: right;display: flex;align-items: center;height: 60px">
                        <headImg :imgUrl="admin.headimg" size="50"></headImg>
                        <el-dropdown>
                            <span style="margin-left:10px; cursor: pointer">
                        {{admin.name}}<i class="el-icon-arrow-down el-icon--right"></i>
                      </span>
                            <el-dropdown-menu slot="dropdown">
                                <el-dropdown-item @click.native="editAdmin">个人信息</el-dropdown-item>
                                <el-dropdown-item @click.native="changePassword">更改密码</el-dropdown-item>
                                <el-dropdown-item @click.native="quit">注销</el-dropdown-item>
                            </el-dropdown-menu>
                        </el-dropdown>
                    </div>
                </el-col>
            </el-row>
        </el-header>
        <el-container>
            <el-aside width="200px" style="background-color: rgb(84, 92, 100)">
                <el-menu router background-color="#545c64" text-color="#fff">
                    <el-submenu index="12">
                        <template slot="title"><i class="el-icon-h-bumen"></i>分店管理</template>
                        <el-menu-item index="/shopList">分店列表</el-menu-item>
                    </el-submenu>
                    <el-submenu index="1">
                        <template slot="title"><i class="el-icon-h-bumen"></i>基础管理</template>
                        <el-menu-item index="/positionList">职位职称</el-menu-item>
                        <el-menu-item index="/userList">员工列表</el-menu-item>
                    </el-submenu>
                    <el-submenu index="2">
                        <template slot="title"><i class="el-icon-h-guke1"></i>品牌管理</template>
                        <el-menu-item index="/factoryList">合作厂商</el-menu-item>
                        <el-menu-item index="/brandList">品牌列表</el-menu-item>
                    </el-submenu>
                    <el-submenu index="3">
                        <template slot="title"><i class="el-icon-h-wendang"></i>品相管理</template>
                        <el-menu-item index="/categorylist">品项分类</el-menu-item>
                        <el-menu-item index="/subjectList">项目列表</el-menu-item>
                        <el-menu-item index="/goodsList">产品列表</el-menu-item>
                    </el-submenu>
                    <!-- <el-submenu index="5">
                        <template slot="title"><i class="el-icon-h-kaidan"></i>经营管理</template>
                        <el-menu-item index="/orderList">修改单据</el-menu-item>
                    </el-submenu> -->
                    <el-submenu index="8">
                        <template slot="title"><i class="el-icon-h-liushi1"></i>库存管理</template>
                        <el-menu-item index="/stockList">出入库管理</el-menu-item>
                        <el-menu-item index="/stockGoodslist">库存统计</el-menu-item>
                    </el-submenu>
                    <el-submenu index="9">
                        <template slot="title"><i class="el-icon-h-chakan"></i>权限管理</template>
                        <el-menu-item index="/permissionLevel/1">权限等级</el-menu-item>
                        <el-menu-item index="/groupAdminlist">账号权限</el-menu-item>
                    </el-submenu>
                    <el-submenu index="10">
                        <template slot="title"><i class="el-icon-h-set2"></i>基础设置</template>
                        <el-menu-item index="/vipgradeList">会员等级</el-menu-item>
                        <el-menu-item index="/diagnosisList">会员诊断</el-menu-item>
                        <el-menu-item index="/guestCategoryList">客户分类</el-menu-item>
                        <el-menu-item index="/guestThreephase">会员三期</el-menu-item>
                    </el-submenu>
                </el-menu>
            </el-aside>
            <el-main style="background-color: #F0F3F3">
                <transition name="fade" mode="out-in">
                    <router-view></router-view>
                </transition>
            </el-main>
        </el-container>
    </el-container>
</template>
<script>
import C from '#/src/common/common.js'
import Setting from '#/src/shop/setting.js'
import headImg from '@/components/headImg.vue'
export default {
    name: 'app',
    data() {
        return {
            admin: { headimg: '' },

        }
    },
    methods: {
        openSetting() {
            Setting.openSetting()
        },
        async getAdminInfo() {
            let data = await C.ajax('/shop/index/getadmininfo', {}, 'post')
            this.admin = data.ainfo
            C.setLocalStorage('initConfig', JSON.stringify(data.initConfig))
        },
        async editAdmin() {
            await C.openBrowserWindow('/adminEdit', {}, {
                transparent: true,
                frame: false,
                // openDevTools: true,
                width: 390,
                height: 600,
                useSpa: true,
                spaModel: 'organization'
            })
        },
        async changePassword(row) {
            let res = await C.openBrowserWindow('/adminChangepas', row, {
                transparent: true,
                frame: false,
                // openDevTools: true,
                width: 390,
                height: 280,
                useSpa: true,
                spaModel: 'organization'
            })
            if (res) {
                C.success(res.data.info)
            }
        },
        quit () {
            C.confirm('确定要退出吗？', async () => {
                await C.ajax('/login/public/logout', {}, 'post')
                C.setLocalStorage('permission')
                C.setLocalStorage('initConfig')
                C.setLocalStorage('usertoken')
                // 打开登录关闭本窗口aaaaaa
                C.openBrowserWindow('/', {}, {
                    width: 393,
                    height: 500,
                    resizable: false,
                    transparent: true,
                    frame: false,
                    useSpa: true,
                    spaModel: 'login'
                })
                C.closewin()
            })
        }
    },
    mounted: function() {
        this.getAdminInfo()
    },
    components: { headImg }
}
</script>
<style>
.fade-enter-active,
.fade-leave-active {
    transition: opacity .1s;
}

.fade-enter,
.fade-leave-to
/* .fade-leave-active below version 2.1.8 */

{
    opacity: 0;
}

.el-menu {
    border: none;
    overflow: hidden;
}

.el-row {
    margin: 0px;
    padding: 0px;
}

.rowHead {
    padding: 10px;
    background-color: #fff;
    margin: 0px 0px 10px 0px !important;
}

.mainDiv {
    display: flex;
    width: 100%;
    height: 100%;
    flex-direction: column;
}

.el-table td,
.el-table th {
    padding: 6px 0px;
}


/*控制弹框阴影*/

.v-modal {
    position: absolute;
}

.el-message-box__wrapper {
    outline: none;
}

/*刷新按钮*/
.buttonLeft{
    float: right;
    margin-left: 5px
}
.searchArea{
    width: 300px;
    float: right
}
</style>